<template>
  <div class="dics">
    <el-button
      type="text"
      @click="dialogFormVisible = true"
      icon="el-icon-circle-plus-outline"
      >登记新设备</el-button
    >
    <el-dialog title="登记新设备" :visible.sync="dialogFormVisible">
      <el-form :model="form">
        <el-form-item label="设备名称" :label-width="formLabelWidth">
          <el-input v-model="form.name" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="设备数量" :label-width="formLabelWidth">
          <el-input v-model="form.number" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="设备单价" :label-width="formLabelWidth">
          <el-input v-model="form.price" autocomplete="off"></el-input>
        </el-form-item>
        <!-- <el-form-item label="设备状态" :label-width="formLabelWidth">
          <el-select v-model="form.region" placeholder="请选设备状态">
            <el-option label="已审核" value="yishenhe"></el-option>
            <el-option label="未审核" value="wishenhe"></el-option>
          </el-select>
        </el-form-item> -->
        <el-form-item label="设备分类" :label-width="formLabelWidth">
          <el-select v-model="form.category" placeholder="全部分类">
            <el-option
              v-for="item in lis"
              :key="item.id"
              :label="item.id"
              :value="item.name"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="购置时间" :label-width="formLabelWidth">
          <div class="block">
            <el-date-picker
              v-model="form.time"
              type="datetime"
              placeholder="选择日期时间"
              default-time="12:00:00"
            >
            </el-date-picker>
          </div>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="addNews">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "AddNew",
  data() {
    return {
      dialogFormVisible: false,
      form: {
        name: "",
        number: "",
        category: "",
        price: "",
        time: "",
      },
      formLabelWidth: "100px",
      lis: [],
      //   页面更新
      isRouterAlive: true,
    };
  },
  methods: {
    async listss() {
      let res = await this.$axios({
        method: "get",
        url: "/category-list",
        data: this.todata,
      });

      this.lis = res.data.data;
    },
    async addNews() {
      // 刷新页面
      this.dialogFormVisible = false;
      this.$axios({
        method: "post",
        url: "/pre-add",
        data: this.form,
      });

      // 刷新页面信息发送到mainview
      this.$bus.$emit("shuaxin", this.isRouterAlive);
    },
  },
  mounted() {
    this.listss();
  },
};
</script>

<style lang="less" scoped>
.dics {
  flex: 1;
  text-align: left;
  font-size: 14px;
  font-weight: bold;
}
</style>